<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>rem设置窗口大小</title>
<script>
   (function(doc,win){
    var docEl = document.documentElement,resizeEvt = 'orientationchange' in window? 'orientationchange':"resize",
    recalc = function(){
        var clientWidth  =docEl.clientWidth;
        if(!clientWidth){
            return
        }
        if(clientWidth>=750){
            docEl.style.fontSize='14px';
        }else{
            //移动设备的宽度和设计稿的宽度比例是页面渲染设计稿的缩放比例，*100就是把字号方放大100倍。因为当浏览器支持最小字体时候浏览器会把font-size设置为最小默认肢体。为了好计算*100.

              docEl.style.fontSize =(clientWidth/750)*100 +'px';

            //   rem=设计稿宽度/100就是rem的大小了
        }
    }

    if(!doc.addEventListener){
        return
    }
    win.addEventListener(resizeEvt,recalc,false);
    doc.addEventListener("DOMContentLoaded",recalc,false);
   })(document,window)
</script>
</head>
<body>
    <div class="5rem" style="font-size:0.25rem;">ddd 大大发大大发大发</div>


</body>
</html>